<template>
  <div>
    <table-ext :columns="columns" :searchForm="searchForm" :config="config" ref="tableExt">
       <template slot="table-action">
         <el-button type="danger" v-if="config.crudMapping.createBid" @click="createBid()" icon="el-icon-circle-plus">创建</el-button>
         <!-- <el-button v-if="config.crudMapping.closeBid" @click="closeBid()" icon="el-icon-close">废标</el-button> -->
       </template>
    </table-ext>
  </div>
</template>

<script>
  import TableExt from '@/components/common/table-ext/table-ext.vue';
  import TableIcon from '@/components/common/table-ext/table-icon';
  export default {
    components:{
      'table-ext': TableExt
    },
    data() {
      return {
        test:'',
        userOptions: [{
          value: '-1',
          label: '系统管理员'
        }],
        config:{
          title: '招标', //页面标题
          isPage: true, //是否分页
          isNo: false, //是否显示序号
          selection: false, //是否显示复选框
          crudMapping:{ // CRUD方法
            query:{
              url: this.lib.config.host.bidtender + '/bidmgt/view/query',
              data:{}
            },
            createBid:{
              url: this.lib.config.host.bidtender + '/bidtender/bid/addNew',
            },
            closeBid:{
              url: this.lib.config.host.bidtender + '/bidtender/bid/close',
            }
          }
        },
        formLabelWidth: '120px',
        // 查询表单配置
        searchForm:[
          //显示标签 数据字段 标签类型
          {label: '招标编号', key: 'psNo', type: 'input'},
          {label: '项目名称', key: 'psTitle', type: 'input'},
          {label: '竞标供应商提交状态',key: 'publishStatus',type: 'select',
            dict: [
              {label:'全部',value:''},
              {label:'未提交',value:'0'},
              {label:'已提交',value:'1'}
            ]
          },
          {label: '竞标供应商审核状态',key: 'checkStatus',type: 'select',
            dict: [
              {label:'全部',value:''},
              {label:'未审核',value:'0'},
              {label:'已审核',value:'1'}
            ]
          },
          {label: '评标方法提交状态',key: 'ruleSubmitStatus',type: 'select',
            dict: [
              {label:'全部',value:''},
              {label:'未提交',value:'0'},
              {label:'已提交',value:'1'},
            ]
          },
          {label: '评标方法审核状态',key: 'ruleCheckStatus',type: 'select',
            dict: [
              {label:'全部',value:''},
              {label:'未审核',value:'0'},
              {label:'已审核',value:'1'}
            ]
          },
          {label: '应标状态',key: 'responseStatus',type: 'select',
            dict: [
              {label:'全部',value:''},
              {label:'未应标',value:'0'},
              {label:'部分应标',value:'2'},
              {label:'全部应标',value:'2'}
            ]
          },
          {label: '保证金缴纳状态',key: 'bondPayStatus',type: 'select',
            dict: [
              {label:'全部',value:''},
              {label:'未缴纳',value:'0'},
              {label:'部分缴纳',value:'2'},
              {label:'已缴纳',value:'1'},
            ]
          },
          {label: '保证金确认状态',key: 'confirmBondStatus',type: 'select',
            dict: [
              {label:'全部',value:''},
              {label:'未确认',value:'0'},
              {label:'已确认',value:'1'},
              {label:'部分确认',value:'2'},
            ]
          },
          {label: '开标状态',key: 'submitCompStatus',type: 'select',
            dict: [
              {label:'全部',value:''},
              {label:'未开标',value:'-1'},
              {label:'已开标',value:'1'},
            ]
          },
          {label: '评标状态',key: 'evaluationStatus',type: 'select',
            dict: [
              {value:'全部',value:''},
              {value:'未评标',value:'0'},
              {value:'评标中',value:'1'},
              {value:'商务专家已评',value:'2'},
              {value:'技术专家已评',value:'3'},
            ]
          },
          {label: '中标状态',key: 'submitWinStatus',type: 'select',
            dict: [
              {label:'全部',value:''},
              {label:'未授标',value:'-1'},
              {label:'已授标',value:'1'},
            ]
          }
        ],
        // 表格列定义
        columns:[{
          label: '操作', align:'center',width:'120',
          render:(createElement, params)=>{ // 动态渲染，click事件示例
            let _this = this;
            let edit=params.row.publishStatus===3?createElement('el-button',
                { props: { type: 'text' },
                  on: {
                    click(){
                      _this.$router.push({name:'creatBid',query:{id:params.row.id}});
                    }
                  }
                },'编辑'):'';
            return createElement('div', {},
              [   edit,
                  createElement('el-button',
                  { props: { type: 'text' },
                    on: {
                      click(){
                        _this.closeBid(params.row);
                      }
                    }
                  },'废标')
                ]
              );
          }
        },
        {label: '招标编号',key: 'psNo',width:'120',align:'center',
          render:(createElement, params)=>{ // 动态渲染，click事件示例
            let _this = this;
            return createElement('div', {},
            [createElement('el-button', {
                props: {
                  type: 'text',
                },
                on: {
                  click() {
                    
                    let step= (params.row.ruleCheckStatus===0 || params.row.ruleCheckStatus===3)?1
                      :params.row.confirmBondStatus===3?2
                      :params.row.submitCompStatus===3?3
                      :params.row.evaluationStatus===3?4
                      :5;
                    const {href} = _this.$router.resolve({
                      name: 'BidSteps',
                      query: {id:params.row.id,step:step}
                    })
                    window.open(href, '_blank');
                  }
                }
              }, params.row.psNo)
            ]);
          }
        },
        {label: '项目名称',key: 'psTitle',width:'160',align:'left',halign:'center'},
        {label: '采购组织',key: 'purOrgName',width:'120',align:'center'},
        {label: '竞标供应商提交',key: 'publishStatus',width:'120',align:'center',render:(createElement, params)=>{
          return createElement(TableIcon,{props:{
              flag: params.row.publishStatus,
              titles: [{status:0,title:'未提交'},{status:1,title:'已提交'}]
          }});
        }},
        {label: '竞标供应商审核',key: 'checkStatus',width:'120',align:'center',render:(createElement, params)=>{
          return createElement(TableIcon,{props:{
              flag: params.row.checkStatus,
              titles: [{status:0,title:'未审核'},{status:1,title:'已审核'},{status:3,title:'待审核'}]
          }});
        }},
        {label: '评标方法提交',key: 'ruleSubmitStatus',width:'110',align:'center',render:(createElement, params)=>{
          return createElement(TableIcon,{props:{
              flag: params.row.ruleSubmitStatus,
              titles: [{status:0,title:'未提交'},{status:1,title:'已提交'}]
          }});
        }},
        {label: '评标方法审核',key: 'ruleCheckStatus',width:'110',align:'center',render:(createElement, params)=>{
          return createElement(TableIcon,{props:{
              flag: params.row.ruleCheckStatus,
              titles: [{status:0,title:'未审核'},{status:1,title:'已审核'},{status:3,title:'待审核'}]
          }});
        }},
        {label: '应标',key: 'responseNum',width:'60',align:'center'},
        {label: '投标',key: 'tenderNum',width:'60',align:'center'},
        {label: '开标',key: 'submitCompStatus',width:'60',align:'center',render:(createElement, params)=>{
          return createElement(TableIcon,{props:{
              flag: params.row.submitCompStatus,
              titles: [{status:0,title:'未开标'},{status:1,title:'未审核'}]
          }});
        }},
        {label: '评标',key: 'evaluationStatus',width:'60',align:'center',render:(createElement, params)=>{
          return createElement(TableIcon,{props:{
              flag: params.row.evaluationStatus,
              titles: [{status:0,title:'未评标'},{status:1,title:'已评标'}]
          }});
        }},
        {label: '中标',key: 'submitWinStatus',width:'60',align:'center',render:(createElement, params)=>{
          return createElement(TableIcon,{props:{
              flag: params.row.submitWinStatus,
              titles: [{status:0,title:'已中标'},{status:1,title:'未中标'}]
          }});
        }},
        {label: '流标状态',key: 'flowStatus',width:'80',align:'center',render:(createElement, params)=>{
          return createElement(TableIcon,{props:{
              flag: params.row.flowStatus,
              titles: [{status:0,title:'未流标'},{status:1,title:'已流标'}]
          }});
        }},        
        {label: '废标',key: 'closeStatus',width:'60',align:'center',render:(createElement, params)=>{
          return createElement(TableIcon,{props:{
              flag: params.row.closeStatus,
              titles: [{status:0,title:'未废标'},{status:1,title:'已废标'}]
          }});
        }},
        {label: '合同状态',key: 'contractStatus',width:'80',align:'center',render:(createElement, params)=>{
          return createElement(TableIcon,{props:{
              flag: params.row.contractStatus,
              titles: [{status:0,title:'未生成合同'},{status:1,title:'已生成合同'}]
          }});
        }},
        {label: '创建日期',key: 'createTime',width:'100',align:'center'},
        {label: '创建人',key: 'createUserId',width:'80',align:'center'}
        ]
      };
    },
    created(){
      if(this.$route.query){
        this.config.crudMapping.query.data = this.$route.query;
      }
    },
    mounted(){ // VUE页面渲染之后调用的方法
      this.initData();
    },
    methods: {
      // 初始化页面数据
      initData(){

      },
      createBid(){
        this.$router.push({name:'creatBid'});
      },
      closeBid({id}){
        if(!this.$refs.tableExt.tableData.length)return;
        this.$confirm('此操作将关闭此次招标, 是否继续?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          this.axios.post(`${this.lib.config.host.bidtender}/bidtender/bid/closeBid/${id}`).then((response)=>{
              this.$message({
                type: 'success',
                message: '废标成功!'
              });
              this.$refs.tableExt.search();
          });
        }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取消此次操作!'
          });
        });
      }
    }
  }

</script>
